<script setup lang="ts">
import { SearchConfig } from './config/search-config';
import { tableConfig } from './config/table-config';
import { doGetAuxiliaryList } from '@/api/modeling/auxiliaryResources/index';
import { generateNameToLevel } from '@/config/constant';
import { EType } from '@/config';
import { Message } from '@/instance';
import type { AuxiliaryData } from '@/api/modeling/auxiliaryResources/model/type';

const visibleModal = ref(false);

const auxilaryId = ref();
const open = (id?: string) => {
    visibleModal.value = true;
    auxilaryId.value = id;
};
const { getMaxHeight, modalSlotRef, handleFullscreen } = useModal();

// 回显选中表格
watch(
    () => modalSlotRef.value?.tableData,
    tableData => {
        if (tableData && Object.keys(tableData).length) {
            if (!auxilaryId.value) return;
            if (tableData && Object.keys(tableData).length) {
                // 初始化工序编码列表选择行
                const row = tableData.filter(
                    (item: AuxiliaryData) => item.id === auxilaryId.value
                )[0];
                if (row) modalSlotRef.value?.setCurrentRow(row); // 设置表格选中当前行
            }
        }
    }
);

const { search } = useParams(modalSlotRef);
const emit = defineEmits(['submit', 'close']);

const submit = () => {
    const selectRow = modalSlotRef.value?.selectTableRowData;
    visibleModal.value = false;

    emit('submit', selectRow || {});
};

/**
 * @:
 * @return {*}
 */
const mapStatus = {
    IDLE: '空闲',
    USING: '使用中',
    SCRAP: '报废',
    REPAIRING: '维修中'
} as const;

type MapStatus = typeof mapStatus;
type KeyMapStatus = keyof MapStatus;
const router = useRouter();
const toLink = () => {
    visibleModal.value = false;
    router.push('/auxiliaryResources');
    emit('close');
};

/**
 * 设置辅助资源表格行样式名
 */
const getRowClassName = ({ row }: SlotData<AuxiliaryData>) => {
    return isScrap(row.status) ? 'row-disabled' : '';
};

/**
 * 判断当前辅助资源是否为报废状态
 */
const isScrap = (status: KeyMapStatus) => {
    return status === 'SCRAP';
};

/**
 * 点击当前辅助资源列表行
 */
const handleRowClick = (row: AuxiliaryData) => {
    if (isScrap(row.status)) {
        Message.error('当前辅助资源为报废状态，请重新选择！');
        modalSlotRef.value?.setCurrentRow();
        return;
    }
};

defineExpose({
    open
});
</script>

<template>
    <q-modal
        v-model:visible="visibleModal"
        title="选择辅助资源"
        :centered="true"
        :fullscreen="true"
        width="980px"
        @fullscreen="handleFullscreen"
        @ok="submit"
    >
        <base-search
            ref="searchRef"
            :table-ref="modalSlotRef"
            :search-config="SearchConfig"
            @search="search"
        >
        </base-search>

        <base-table
            :id="generateNameToLevel('2')"
            ref="modalSlotRef"
            :modal-mode="true"
            :max-height="getMaxHeight"
            :get-data-fn="doGetAuxiliaryList"
            :table-config="tableConfig"
            :show-setting="false"
            :un-action="true"
            :table-attr="{ rowClassName: getRowClassName }"
            @row-click="handleRowClick"
        >
            <template #tableHeadStart>
                <q-push-button :is-text="false" @click="toLink" />
            </template>
            <template #type="{ row }: SlotData<AuxiliaryData>">
                {{ EType[row.type] }}
            </template>
            <template #status="{ row }: SlotData<AuxiliaryData>">
                <div class="align-center">
                    {{ mapStatus[row.status] }}
                </div>
            </template>
        </base-table>
    </q-modal>
</template>

<style scoped lang="scss">
:deep() {
    .row-disabled {
        cursor: not-allowed;
    }
}
</style>
